<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ include file="/common/tag.jsp"%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>电话管理</title>
<jsp:include page="/commons/common-js.jsp"></jsp:include>
<style type="text/css">
	.content {
		padding: 10px 10px 10px 10px;
	}
</style>
</head>
<body class="easyui-layout">
    <div data-options="region:'west',title:'菜单',split:true" style="width:180px;">
    	<ul id="menu" class="easyui-tree" style="margin-top: 10px;margin-left: 5px;">
         	<li>
         		<span>电话管理</span>
         		<ul>
	         		<li data-options="attributes:{'url':'${pageContext.request.contextPath}/page/phone_list'}">电话列表</li>
	         		<li data-options="attributes:{'url':'${pageContext.request.contextPath}/page/record_list'}">已播列表</li>
	         	</ul>
         	</li>
         </ul>
    </div>
    <div data-options="region:'center',title:''">
    	<div id="tabs" class="easyui-tabs">
		    <div title="首页" style="padding:20px;">
		    	<div>
		        <font color="red" size="7px"><strong>操作步骤:</strong></font>	<br>
		        <font color="blue" size="5px">1.USB连接硬件设备,点击打开设备按钮<br>
		        2.点击查找设备,检查是否连接成功.
		        </font>
		        </div>
		    </div>
		</div>
    </div>
    
<script type="text/javascript">
$(function(){
	$('#menu').tree({
		onClick: function(node){
			if($('#menu').tree("isLeaf",node.target)){
				var tabs = $("#tabs");
				var tab = tabs.tabs("getTab",node.text);
				if(tab){
					tabs.tabs("select",node.text);
				}else{
					tabs.tabs('add',{
					    title:node.text,
					    href: node.attributes.url,
					    closable:true,
					    bodyCls:"content"
					});
				}
			}
		}
	});
	$(".tree-title:contains('电话列表')").parent().click();
});
</script>
</body>
</html>